<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>你的网页标题</title>
    <link rel="stylesheet" href="styles.css">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous">

</head>
<body>

    <h2 id="hello">hello  </h2>

	<div class="container">
        <div class="row">
            <div class="col">
                <div class="card" style="width: 25rem;">
        	      
        	      <div class="card-body mx-auto">
        		    <h5 class="card-title">Card title</h5>
        		    
        		    <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.
        		        Some quick example text to build on the card title and make up the bulk of the card's content.
        		    </p>
        		    <a href="#" class="btn btn-primary">Go somewhere</a>
        	      </div>
        	    </div> 
        	    
        	    <div class="card" style="width: 25rem;">
        	      
        	      <div class="card-body">
        		    <h5 class="card-title">Card title</h5>
        		    
        		    <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.
        		        Some quick example text to build on the card title and make up the bulk of the card's content.
        		        Some quick example text to build on the card title and make up the bulk of the card's content.
        		        Some quick example text to build on the card title and make up the bulk of the card's content.
        		    </p>
        		    <a href="#" class="btn btn-primary">Go somewhere</a>
        	      </div>
        	    </div>
        	    
        	    
            </div>
            <div class="col">
                <div class="card" style="width: 25rem;">
        	      
        	      <div class="card-body">
        		    <h5 class="card-title">Card title</h5>
        		    
        		    <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.
        		       Some quick example text to build on the card title and make up the bulk of the card's content.
        		    </p>
        		    <a href="#" class="btn btn-primary">Go somewhere</a>
        	      </div>
        	    </div>
            </div>
            <div class="col">
                <div class="card" style="width: 25rem;">
        	      
        	      <div class="card-body">
        		    <h5 class="card-title">Card title</h5>
        		    
        		   <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.
       		       Some quick example text to build on the card title and make up the bulk of the card's content.
       		        Some quick example text to build on the card title and make up the bulk of the card's content.
       		         Some quick example text to build on the card title and make up the bulk of the card's content.
       		          Some quick example text to build on the card title and make up the bulk of the card's content.
       		           Some quick example text to build on the card title and make up the bulk of the card's content.
       		       </p>
        		    <a href="#" class="btn btn-primary">Go somewhere</a>
        	      </div>
        	    </div>
            </div>
        </div>
        
        
        
        <div class="row">
            <div class="col">
                <div class="card" style="width: 25rem;">
        	      
        	      <div class="card-body">
        		    <h5 class="card-title">Card title</h5>
        		    
        		    <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.
        		        Some quick example text to build on the card title and make up the bulk of the card's content.
        		    </p>
        		    <a href="#" class="btn btn-primary">Go somewhere</a>
        	      </div>
        	    </div>
            </div>
            <div class="col">
                <div class="card" style="width: 25rem;">
        	      
        	      <div class="card-body">
        		    <h5 class="card-title">Card title</h5>
        		    
        		    <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.
        		       Some quick example text to build on the card title and make up the bulk of the card's content.
        		    </p>
        		    <a href="#" class="btn btn-primary">Go somewhere</a>
        	      </div>
        	    </div>
            </div>
            <div class="col">
                <div class="card" style="width: 25rem;">
        	      
        	      <div class="card-body">
        		    <h5 class="card-title">Card title</h5>
        		    
        		   <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.
       		       Some quick example text to build on the card title and make up the bulk of the card's content.
       		        Some quick example text to build on the card title and make up the bulk of the card's content.
       		         Some quick example text to build on the card title and make up the bulk of the card's content.
       		          Some quick example text to build on the card title and make up the bulk of the card's content.
       		           Some quick example text to build on the card title and make up the bulk of the card's content.
       		       </p>
        		    <a href="#" class="btn btn-primary">Go somewhere</a>
        	      </div>
        	    </div>
            </div>
        </div>
	    
	</div>
	
    

   
    <footer>
        <p>&copy; 2023 你的公司名或个人名. All rights reserved.</p>
    </footer>

    <script src="https://cdn.jsdelivr.net/npm/showdown@2.0.3/dist/showdown.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js" integrity="sha384-/mhDoLbDldZc3qpsJHpLogda//BVZbgYuw6kof4u2FrCedxOtgRZDTHgHUhOCVim" crossorigin="anonymous"></script>
    <script>
    window.addEventListener('load',
        function() {
            var converter = new showdown.Converter(),
            text      = {{content}}
          html      = converter.makeHtml(text);
            console.log(html);
            document.getElementById("hello").innerHTML=html;
          }
      );
      </script>
</body>
</html>
